Vue.component("mybody",{
    template:`
    <div>
        <login ref="lg" @onlogin="onlogin"></login>
        <header class="header">
          <nav class="navbar navbar-default" id="navbar">
            <div class="container">
              <div class="header-topbar hidden-xs link-border">
                <ul class="site-nav topmenu">
                  <li><a href="tags.html">标签云</a></li>
                  <li><a href="readers.html" rel="nofollow">读者墙</a></li>
                  <li><a href="links.html" rel="nofollow">友情链接</a></li>
                  <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" rel="nofollow">关注本站 <span class="caret"></span></a>
                    <ul class="dropdown-menu header-topbar-dropdown-menu">
                      <li><a data-toggle="modal" data-target="#WeChat" rel="nofollow"><i class="fa fa-weixin"></i> 微信</a></li>
                      <li><a href="#" rel="nofollow"><i class="fa fa-weibo"></i> 微博</a></li>
                      <li><a data-toggle="modal" data-target="#areDeveloping" rel="nofollow"><i class="fa fa-rss"></i> RSS</a></li>
                    </ul>
                  </li>
                </ul>
                
                <a v-if="!user" @click.prevent="$refs.lg.showLogin" class="login" rel="nofollow">Hi,请登录</a>
                <a v-else class="login">欢迎 {{user.name}}</a>
                
                &nbsp;&nbsp;
                <a v-if="!user" href="javascript:;" class="register" rel="nofollow">我要注册</a>
                <span v-else>
                    <a href="articleAdd.html" class="register" rel="nofollow">发布文章</a>
                    <a href="logout" class="register" rel="nofollow">退出</a>
                </span>
                
                </div>
              <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-navbar" aria-expanded="false"> <span class="sr-only"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
                <h1 class="logo hvr-bounce-in"><a href="" title=""><img src="images/logo.png" alt=""></a></h1>
              </div>
              <div class="collapse navbar-collapse" id="header-navbar">
                <ul class="nav navbar-nav navbar-right">
                  <li class="hidden-index active"><a data-cont="异清轩首页" href="index.html">异清轩首页</a></li>
                  <li><a href="category.html">前端技术</a></li>
                  <li><a href="category.html">后端程序</a></li>
                  <li><a href="category.html">管理系统</a></li>
                  <li><a href="category.html">授人以渔</a></li>
                  <li><a href="category.html">程序人生</a></li>
                </ul>
                <form class="navbar-form visible-xs" action="/Search" method="post">
                  <div class="input-group">
                    <input type="text" name="keyword" class="form-control" placeholder="请输入关键字" maxlength="20" autocomplete="off">
                    <span class="input-group-btn">
                    <button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
                    </span> </div>
                </form>
              </div>
            </div>
          </nav>
        </header>
        <slot></slot>
        <footer class="footer">
          <div class="container">
            <p>&copy; 2016 <a href="">ylsat.com</a> &nbsp; <a href="http://www.miitbeian.gov.cn/" target="_blank" rel="nofollow">豫ICP备20151109-1</a> &nbsp; <a href="sitemap.xml" target="_blank" class="sitemap">网站地图</a></p>
          </div>
          <div id="gotop"><a class="gotop"></a></div>
        </footer>
    </div>
    `,
    data(){
        return {user:null};
    },
    methods:{
        onlogin(user){
            this.user = user;
        }
    }
})

Vue.component("labels",{
    template:`
    <div>
        <slot :tags="tags"></slot>
    </div>`,
    data(){
        return {tags:[]}
    },
    created(){
        axios.get("/blog/article/queryLabels").then(res=>{
            for (let tag in res.data) {
                let num = res.data[tag];
                this.tags.push({
                    name: tag,
                    nums: num
                })
            }
            this.tags.sort((t1,t2)=>t2.nums - t1.nums);
        });
    }
})